page {
 	width: 100%;
 	height: 100% !important;
 }
.container{
		display: flex;
		flex-direction: column;
		overflow: hidden;
		flex: 1;
		
		.grade_box{
			 padding:0rpx 20rpx 30rpx 20rpx;
			 .grade_title_box{
			 	
			 		color: #303030;
			 		font-weight: 600; 
			 		font-size:32rpx; 
			 		display: flex;
			 		justify-content: center;
			 }
			 .grid-item-box {
			 	flex: 1;
			 	// position: relative;
			 	/* #ifndef APP-NVUE */
			 	display: flex;
			 	/* #endif */
			 	flex-direction: column;
			 	align-items: center;
			 	justify-content: center;
			 	margin-top: 10rpx;
			 	margin-bottom: 10rpx;
			 	margin-left: 20rpx;
			 	margin-right: 20rpx;
			 	justify-content: center;
			 	align-items: center;
			 	background-color: #f3f3f3;
			 	border-radius: 10rpx;
			 	color: #b9b9b9;
			 	//border: 1px solid #8AC007;
				
				
			 }
			 .grid_item_text {
			 	display: flex;
			 	height: 100rpx;
			 	vertical-align: middle;
			 	text-align: center;
			 	align-items: center;
			 	justify-content: center;
			 	font-size: 32rpx;
			 	font-weight: 500;
			 
			 }
			 .grid-item-box-checked {
			 	flex: 1;
			 	// position: relative;
			 	/* #ifndef APP-NVUE */
			 	display: flex;
			 	/* #endif */
			 	flex-direction: column;
			 	align-items: center;
			 	justify-content: center;
			 	margin-top: 10rpx;
			 	margin-bottom: 10rpx;
				margin-left: 20rpx;
				margin-right: 20rpx;
			 	justify-content: center;
			 	align-items: center;
			 	background-color: #f3f3f3;
			 	border-radius: 10rpx;
			 	color: #fff;
			 	background-image: linear-gradient(to right, #efe2d6, #cfbca8, #b8a288);
			 }
			 .grid-item-box:active {
			 	background-color: #cbd2d9;
			 }
			 
		}
		
		
		
		
		
 }


 